// modules/introduce/pages/group/group.js
import {
  getGroup
} from '@/api/introduce'
const appInstance = getApp()

const groupNumber = 7; // 7个组别
const destination = 80; // 卡片间距
const front = destination * groupNumber; // 前边界

Page({
  data: {
    cards: [{
        name: "前端组",
        color: '#6B89C5',
        img: 'https://smalla.oss-cn-guangzhou.aliyuncs.com/前端组.png'
      },
      {
        name: "后台组",
        color: '#E8A93E',
        img: 'https://smalla.oss-cn-guangzhou.aliyuncs.com/后台组.png'
      },
      {
        name: "ai组",
        color: '#7240E8',
        img: 'https://smalla.oss-cn-guangzhou.aliyuncs.com/ai组.png'
      },
      {
        name: "电控组",
        color: '#C75626',
        img: 'https://smalla.oss-cn-guangzhou.aliyuncs.com/电控组.png'
      },
      {
        name: "机械组",
        color: '#3BA2A8',
        img: 'https://smalla.oss-cn-guangzhou.aliyuncs.com/机械组.png'
      },
      {
        name: "运营组",
        color: '#C56B6D',
        img: 'https://smalla.oss-cn-guangzhou.aliyuncs.com/运营组.png'
      },
      {
        name: "项目组",
        color: '#177047',
        img: 'https://smalla.oss-cn-guangzhou.aliyuncs.com/项目组.png'
      }
    ],
    startY: 0, // 记录滑动起始位置
    currentTranslateZ: 0, // 记录当前滑动距离
  },

  async onLoad() {
    this.initCards();
  },

  async initCards() {
    const {
      data
    } = await getGroup()
    // console.log(data)
    const groupList = this.data.cards
    groupList.map((item, index) => {

      data.forEach(function (element) {
        if (element.name === item.name) {
          groupList[index].id = element.id
          groupList[index].keywords = element.keywords

        }
      })
      groupList[index].translateZ = index * destination
      groupList[index].zIndex = index
      groupList[index].opacity = 1
    })
    this.setData({
      cards: groupList
    });
    console.log(this.data.cards)
    appInstance.globalData.groups = groupList
  },

  handleTouchStart(e) {
    // 记录滑动起始位置
    this.setData({
      startY: e.touches[0].clientY
    });
  },

  handleTouchMove(e) {
    const {
      startY,
      cards
    } = this.data;
    const currentY = e.touches[0].clientY;
    const deltaY = currentY - startY; // 计算滑动距离

    // 根据滑动距离调整卡片位置
    const newCards = cards.map((card, index) => {
      let newZ = card.translateZ + deltaY * 0.1; // 滑动速度系数
      newZ = newZ > front ? newZ - front : newZ < 0 ? newZ + front : newZ;

      const opacityLine = destination * (groupNumber - 0.5);
      const opacity = newZ > opacityLine ?
        1 - (newZ - opacityLine) / (front - opacityLine) :
        1;

      return {
        ...card,
        translateZ: newZ,
        opacity
      };
    });

    // 排序计算zIndex
    const sorted = [...newCards]
      .sort((a, b) => a.translateZ - b.translateZ)
      .forEach((item, index) => item.zIndex = index);

    this.setData({
      cards: newCards,
      currentTranslateZ: deltaY
    });
  },

  handleTouchEnd() {
    // 滑动结束，重置起始位置
    this.setData({
      startY: 0,
      currentTranslateZ: 0
    });
  },
});